$(function(){
    $('#xi').hide()
    // 文字依次出现
    var x=0;
    var tit= $('.home h3').text().split('')    
    // console.log(tit)
    var times = setInterval(function(){
        $('.home h1').append(tit[x])
        x++;                 
        if(x>tit.length-1){
            clearInterval(times)
         }      
    },150)
    // 显示隐藏规则
    $("#show").click(function(){
        $(".text").show(2000)
    })
    $("#hide").click(function(){
        $(".text").hide(1000)
    })
    $(".start").click(function(){
        // 洗牌动画
        setInterval(function(){
            $(".pic img.o1").animate({left:'750px'},300,function(){
               $(".pic img.o3").animate({left:'750px'},100,function(){
                  $(".pic img.o1").animate({left:'680px'},100,function(){
                    $(".pic img.o2").animate({left:'750px'},100,function(){
                        $(".pic img.o3").animate({left:'680px'},100,function(){
                            $(".pic img.o2").animate({left:'680px'})
                        })
                    })
                  })
               })
            })
        }, 300);
        
        // var x = $(".pic img.o2").offset().left;
        // console.log(x)        
        
    })
    let xi = document.querySelector('#xi')
    let btn = document.querySelector('.start')
    // console.log(btn)
    btn.onclick = function play(){
        xi.play();
    }
   
})